<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Facebook Example</title>
  </head>
  <body>
    <fb:login-button perms="user_events,friends_events" autologoutlink="true"></fb:login-button>

    {% if all_events %}
        {% for evt in all_events %}
          <p>Event Name: {{ evt.name|escape }}</p>
          <p>Event Location: {{ evt.location|escape }}</p>
          <p>Event Start Time: {{ evt.start_time|escape }}</p>
          <p>Event End Time: {{ evt.start_time|escape }}</p>
        {% endfor %}
    {% endif %}

    <div id="fb-root"></div>
    <script>
      window.fbAsyncInit = function() {
        FB.init({appId: '{{ facebook_app_id }}', status: true, cookie: true,
                 xfbml: true});
        FB.Event.subscribe('{% if current_user %}auth.logout{% else %}auth.login{% endif %}', function(response) {
          window.location.reload();
        });
      };
      (function() {
        var e = document.createElement('script');
        e.type = 'text/javascript';
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
        e.async = true;
        document.getElementById('fb-root').appendChild(e);
      }());
    </script>
  </body>
</html>